@extends('layouts.admin')

@section('content')
    <div class="console-title">
        <div class="float-right">
            <a href="{{admin_url('post/catlog')}}">
                <span class="btn btn-primary">分类管理</span>
            </a>
            <a href="{{admin_url('post')}}">
                <span class="btn btn-primary">返回列表</span>
            </a>
        </div>
        <h2>发布文章</h2>
    </div>
    <div class="content-div">
        <form method="post" id="Form" autocomplete="off" action="{{admin_url('post/save')}}">
            {{csrf_field()}}
            <input type="hidden" name="aid" value="{{$aid}}">
            <table width="100%" border="0" cellspacing="0" cellpadding="0" class="formtable">
                <tr>
                    <td width="80">文章标题</td>
                    <td><input type="text" class="form-control" placeholder="在这里输入标题" name="postitem[title]" value="{{$item['title'] or ''}}" id="title" style="width: 760px;" required></td>
                </tr>
            </table>
            <table width="100%" border="0" cellspacing="0" cellpadding="0" class="formtable">
                <tr>
                    <td width="80">目录分类</td>
                    <td width="380">
                        <select name="postitem[catid]" class="form-control w300" title="">
                            {!! $catlogOptions !!}
                        </select>
                    </td>
                    <td width="80">文章来源</td>
                    <td width="320"><input type="text" title="" class="form-control w300" name="postitem[from]" value="{{$item['from'] or ''}}"></td>
                    <td rowspan="5" style="text-align: center">
                        <input type="hidden" id="postImage" name="postitem[image]" value="{{$item['image'] or ''}}">
                        <div class="post-image-box" title="点击更换图片">
                            <div class="bg-cover" id="postImagePreview" style="width: 140px; height: 140px; display: inline-block; background-image: url({{image_url($item['image'])}})"></div>
                            <p style="text-align: center; padding-top: 5px;">文章配图</p>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>文章别名</td>
                    <td><input type="text" title="" class="form-control w300" name="postitem[alias]" value="{{$item['alias'] or ''}}"></td>
                    <td>来源地址</td>
                    <td><input type="text" title="" class="form-control w300" name="postitem[fromurl]" value="{{$item['fromurl'] or ''}}"></td>
                </tr>
                <tr>
                    <td>评论设置</td>
                    <td><label><input type="checkbox" name="postitem[allowcomment]" value="1"@if($item['allowcomment']) checked="checked"@endif> 允许评论</label></td>
                    <td>文章标签</td>
                    <td><input type="text" title="" class="form-control w300" name="postitem[tags]" value="{{$item['tags'] or ''}}"></td>
                </tr>
                <tr>
                    <td>文章作者</td>
                    <td><input type="text" title="" class="form-control w300" name="postitem[author]" value="{{$item['author'] or ''}}"></td>
                    <td>文章形式</td>
                    <td>
                        <label><input type="radio" name="postitem[type]" onclick="switchContent('article')" value="article"@if($type=='article') checked="checked"@endif> 文章</label>
                        <label><input type="radio" name="postitem[type]" onclick="switchContent('image')" value="image"@if($type=='image') checked="checked"@endif> 相册</label>
                        <label><input type="radio" name="postitem[type]" onclick="switchContent('video')" value="video"@if($type=='video') checked="checked"@endif> 视频</label>
                    </td>
                </tr>
                <tr>
                    <td>阅读价格</td>
                    <td><input type="text" title="" class="form-control w300" name="postitem[price]" value="{{$item['price'] or ''}}"></td>
                    <td>发布时间</td>
                    <td><input type="text" title="" class="form-control w300" name="postitem[created_at]" value="{{$item['created_at'] or ''}}"></td>
                </tr>
            </table>
            <table width="100%" border="0" cellspacing="0" cellpadding="0" class="formtable">
                <tr>
                    <td width="80">内容摘要</td>
                    <td><textarea title="" class="form-control" name="postitem[summary]" style="height: 100px;">{{$item['summary'] or ''}}</textarea></td>
                </tr>
            </table>
            <!--文章内容部分-->
            <div class="swithContent" id="content-article" style="display: none;">
                <table width="100%" border="0" cellspacing="0" cellpadding="0" class="formtable">
                    <tr>
                        <td width="80">文章内容</td>
                        <td>
                            <div style="box-sizing:border-box">
                                @include('common.editor', ['name' => 'content[content]', 'content'=>$content['content'], 'params'=>[]])
                            </div>
                        </td>
                    </tr>
                </table>
            </div>
            <!--文章内容部分-->
            <div class="swithContent" id="content-image" style="display: none;">
                <table width="100%" border="0" cellspacing="0" cellpadding="0" class="formtable">
                    <tr>
                        <td width="80">图片列表</td>
                        <td>
                            <div id="postImages" class="post-images">
                                @if(isset($images))
                                    @foreach($images as $img)
                                    <div class="post-image-item">
                                        <input type="hidden" name="images[{{$img['id']}}][thumb]" value="{{$img['thumb']}}">
                                        <input type="hidden" name="images[{{$img['id']}}][image]" value="{{$img['image']}}">
                                        <div class="image bg-cover" style="background-image: url({{image_url($img['thumb'])}})"></div>
                                        <div class="image-desc">
                                            <textarea name="images[{{$img['id']}}][description]" class="form-control w500" title="" style="height: 100px;" placeholder="图片介绍">{{$img['description']}}</textarea>
                                        </div>
                                        <a class="delete" onclick="removeItem(this)">&times;</a>
                                    </div>
                                    @endforeach
                                @endif
                            </div>
                            <p><a id="addNewImg"><i class="iconfont icon-roundadd"></i><span>添加图片</span></a></p>
                        </td>
                    </tr>
                </table>
            </div>
            <div class="swithContent" id="content-video" style="display: none;">
                <table width="100%" border="0" cellspacing="0" cellpadding="0" class="formtable">
                    <tr>
                        <td width="80">视频地址</td>
                        <td>
                            <input title="" type="text" class="form-control" name="media[media_link]" value="{{$media['media_link'] or ''}}" style="width:100%;">
                            <p>请输入QQ视频，优酷网、酷6网、56网的视频播放页链接</p>
                        </td>
                    </tr>
                </table>
            </div>
            <table width="100%" border="0" cellspacing="0" cellpadding="0" class="formtable">
                <tr>
                    <td width="80"></td>
                    <td>
                        <input type="button" class="btn btn-primary w100" value="发布" id="submitButton">
                    </td>
                </tr>
            </table>
        </form>
    </div>

    <script type="text/javascript">$("#content-{{$type}}").show();</script>
    <script type="text/javascript">
        function switchContent(type){
            $(".swithContent").hide();
            $("#content-"+type).show();
        }

        function removeItem(o){
            DSXUI.showConfirm('确认要删除此图片吗?', function () {
                $(o).parent().remove();
            });
        }

        $("#postImagePreview").click(function(e) {
            Plugins.showImagePicker(function (data) {
                $("#postImagePreview").css('background-image', 'url('+data.imageurl+')');
                $("#postImage").val(data.image);
            });
        });

        ;$(function(){
            var k = 0;
            $("#addNewImg").on('click', function () {
                Plugins.showImagePicker(function (data) {
                    $("#postImages").append('<div class="post-image-item">' +
                        '<input type="hidden" name="images['+k+'][thumb]" value="'+data.thumb+'">' +
                        '<input type="hidden" name="images['+k+'][image]" value="'+data.image+'">' +
                        '<div class="image bg-cover" style="background-image: url('+data.thumburl+')"></div>' +
                        '<div class="image-desc"><textarea class="form-control w500" name="images['+k+'][description]" placeholder="图片说明文字" style="height: 100px;"></textarea></div>' +
                        '<a class="delete" onclick="removeItem(this)">&times;</a></div>');
                });
                k--;
            });
            $("#postImages").sortable();

            $("#submitButton").on('click',function(e) {
                var form = $("#Form");
                var title = $.trim($("#title").val());
                if(!title){
                    DSXUI.showToast("{{trans('post.post title required')}}");
                    return false;
                }

                form.ajaxSubmit({
                    beforeSend:DSXUI.showSpinner,
                    success:function () {
                        setTimeout(function () {
                            DSXUI.hideSpinner();
                            DSXUI.showToast('文章保存成功', 1500, DSXUtil.reFresh);
                        }, 500);
                    }
                });
            });
        });
    </script>
@stop
